<template>
  <div>
    <el-container>
      <el-header style="background-color: #FF4500;color: #ffff; line-height: 60px">
        <p style="height:60px;overflow:hidden;font-size: 22px;color: white;margin-top: auto">尚书后台管理页面
          <a href="/" style="width: 1100px;text-align: right;display: inline-block">返回首页</a> </p>
      </el-header>
      <el-container style="min-height: 780px; ">
        <el-aside width="200px" style="background-color: rgb(238, 241, 246 )">
            <el-menu :default-openeds="['3']" router>
              <el-submenu index="1">
                <template slot="title"><i class="el-icon-message"></i>管理员管理</template>
                <el-menu-item-group>
                  <el-menu-item index="/admin/adminList">管理员列表</el-menu-item>
                  <el-menu-item index="/admin/adminAdd">添加管理员</el-menu-item>
                </el-menu-item-group>
              </el-submenu>
              <el-submenu index="2">
                <template slot="title"><i class="el-icon-message"></i>用户管理</template>
                <el-menu-item index="/admin/userList">用户列表</el-menu-item>
              </el-submenu>
              <el-submenu index="3">
                <template slot="title"><i class="el-icon-menu"></i>商品管理</template>
                <el-menu-item-group>
                  <el-menu-item index="/admin/bookList">图书列表</el-menu-item>
                  <el-menu-item index="/admin/bookAdd">上架图书</el-menu-item>
                  <el-menu-item index="/admin/category">添加分类</el-menu-item>
                  <el-menu-item index="/admin/test">测试页面</el-menu-item>
                  <el-submenu>
                    <template slot="title">轮播图管理</template>
                    <el-menu-item index="/admin/banner">轮播图列表</el-menu-item>
                    <el-menu-item index="/admin/addBanner">添加轮播图</el-menu-item>
                  </el-submenu>
                </el-menu-item-group>
              </el-submenu>
              <el-submenu index="4">
                <template slot="title"><i class="el-icon-setting"></i>订单管理</template>
                <el-menu-item-group>
                  <el-menu-item index="4-1">订单列表</el-menu-item>
                  <el-menu-item index="4-2">订单详情</el-menu-item>
                </el-menu-item-group>
              </el-submenu>
            </el-menu>
          </el-aside>
        <el-main>
          <router-view/>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  data() {
    return {
      /*menulist: [],
      tableData: Array(20).fill(item)*/
    }
  },
  methods:{
    // 获取左侧菜单
    /*async getMenuList() {
      const { data: res } = await this.$http.get('menus')
      if (res.meta.status !==200) return this.$message.error(res.meta.msg)
      this.menulist = res.data
      console.log(res)
    }*/
  }
};
</script>

<style>
body {
  font: 16px "Microsoft YaHei UI";
  margin: 0;
  padding: 0;
  color: #666;
  overflow-x: hidden;
}
div.el-submenu__title{
  height: 50px;
  line-height: 50px;
}
</style>
